import { PureComponent } from "react"
import { createRef } from "react"
export default class VirtualClassDOM extends PureComponent {
  constructor() {
    super()
    this.refDOM1 = createRef()
    this.refDOM3 = null
  }
  getRef() {
    /** 1. 第一种方式，通过导入createRef函数提前占用一个命名ref,像vue3 */
    console.log(this.refDOM1.current)
    /** 2. 通过回调函数的参数给你返回 */
    console.log(this.refDOM3)
  }

  render() {
    return (
      <div style={{border:'1px solid '}}>
        <button onClick={() => this.getRef()}>获取ref</button>
        <p ref={this.refDOM1}>dom1</p>
        <p
          ref={(el) => {
            this.refDOM3 = el
          }}
        >
          你好
        </p>
      </div>
    )
  }
}
